<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自定义元素指令</title>
</head>
<body>
<div id="wrap">
    <zsd>123</zsd>
</div>
</body>
</html>
<script src="vue.js"></script>
<script type="text/javascript">
    // Vue.directive('指令名称',function (参数) {
    //    this.el.style.backgroundColor=参数
    //    })
    //    参数的传入是在标签中 如: <div v-aa="a1">147</div>

    //    写法
    Vue.elementDirective('zsd', {
        bind: function () {
            this.el.style.backgroundColor = 'blue'
        }
    })
    window.onload = function () {
        var vm = new Vue({
            el: '#wrap',
            data: {
                a1: 'red',
            },
            methods: {}
        });
    }


</script>